<template>
  <div class="page-container">
	<!--工具栏-->
	<div class="toolbar" style="float:left;padding-top:10px;padding-left:15px;font-weight:normal;">
		<el-form :inline="true" :model="filters" :size="size">
			<el-form-item>
				<el-input v-model="filters.name" placeholder="护士姓名"></el-input>
			</el-form-item>
            <el-form-item>
				<el-input v-model="filters.phone" placeholder="护士电话"></el-input>
			</el-form-item>
			<el-form-item>
                <el-select v-model="filters.hospitalId" placeholder="所在医院" class="filter-item">
                    <el-option v-for="item in hospitals" :key="item.id" :label="item.hospitalName" :value="item.id" />
                </el-select>
			</el-form-item>
			<el-form-item>
				<kt-button icon="fa fa-search" :label="$t('action.search')"type="primary" @click="findPage(null)"/>
			</el-form-item>
			<el-form-item>
				<kt-button icon="fa fa-search" label="重置"type="primary"/>
			</el-form-item>
		</el-form>
	</div>
	<div class="toolbar" style="float:right;padding-top:10px;padding-right:15px;">
		<el-form :inline="true" :size="size">
			<el-form-item>
				<el-button-group>
				<el-tooltip content="刷新" placement="top">
					<el-button icon="fa fa-refresh" @click="findPage(null)">刷新</el-button>
				</el-tooltip>
				<el-tooltip content="列显示" placement="top">
					<el-button icon="fa fa-filter" @click="displayFilterColumnsDialog">列显示</el-button>
				</el-tooltip>
				</el-button-group>
			</el-form-item>
		</el-form>
		<!--表格显示列界面-->
		<table-column-filter-dialog ref="tableColumnFilterDialog" :columns="columns" 
			@handleFilterColumns="handleFilterColumns"> 
		</table-column-filter-dialog>
	</div>
	<!--表格内容栏-->
	<kt-table :height="350" :data="pageResult" :columns="filterColumns"
		@findPage="findPage"   @handleStop="handleStop" @handleStart="handleStart">
	</kt-table>
  </div>
</template>
<script>
import PopupTreeInput from "@/components/PopupTreeInput"
import KtTable from "@/views/Core/KtTable"
import KtButton from "@/views/Core/KtButton"
import TableColumnFilterDialog from "@/views/Core/TableColumnFilterDialog"
import { format } from "@/utils/datetime"

export default {
	components:{
		PopupTreeInput,
		KtTable,
		KtButton,
		TableColumnFilterDialog
	},
	data() {
		return {
            hospitals: [{"id":"1","hospitalName":"西南医院"}, {"id":"2","hospitalName":"新桥医院"}, {"id":"3","hospitalName":"人民医院"}],
			hospitalName:"选择医院",
			size: 'small',
			filters: {
				name: null,
				phone:null,
				hosptialId:null
			},
			columns: [],
			filterColumns: [],
			pageRequest: { pageNum: 1, pageSize: 10 },
			pageResult: {"pageNum":0,"pageSize":0,"totalSize":0,"totalPages":0,"content":[]},
		}
	},
	methods: {
				// 获取分页数据
		findPage: function (data) {
			var me = this;
			console.log(this.pageRequest);
			if(data !== null && data !== undefined) {
				me.pageRequest = data
			}
			console.log(me.pageRequest);
			let req = {
				"curPage":me.pageRequest.pageNum,
				"limit":me.pageRequest.pageSize,
				"name":me.filters.name,
				"phone":me.filters.phone,
				"hospitalId":me.filters.hospitalId,
				"isDocter":1
			}
			this.$api.user.findPage(req).then((res) => {
				if(res.code != 200) {
					this.$message({
					message: res.msg,
					type: 'error'
					})
				} else {
					me.pageResult.pageNum = res.page.currPage;
					me.pageResult.pageSize = res.page.pageSize;
					me.pageResult.totalSize = res.page.totalCount;
					me.pageResult.totalPages = res.page.totalPage;
					me.pageResult.content = res.page.list;
					if(me.pageResult.content){
						if(me.hospitals){
							for(var i = 0; i<me.pageResult.content.length; i++){
								for(var j = 0; j<me.hospitals.length; j++){
									var a = me.pageResult.content[i].hosptialId;
									var b = parseInt(me.hospitals[j].id);
									if(a == b){
										me.pageResult.content[i].hospitalName=me.hospitals[j].hospitalName;
									}
								}
							}
						}
					}
					console.log(me.pageResult)
				}
			}).then(data!=null?data.callback:'')
		},
		//查询医院
		findHospital(){
			var req = {};
			this.$api.hospital.findPage(req).then((res) => {
				if(res.code != 200) {
					this.$message({
					message: res.msg,
					type: 'error'
					})
				} else {
					this.hospitals = res.page.list;
				}
			})
		},
		//停用
		handleStop:function(params){
			var dataForm = Object.assign({}, params.row)
			console.log(dataForm);
			var status = 2;
			let req = {"userId":dataForm.id,"type":status}
			this.$api.user.updateStatus(req).then((res) => {
				if(res.code == 200) {
					this.$message({ message: '操作成功', type: 'success' })
				} else {
					this.$message({message: '操作失败, ' + res.msg, type: 'error'})
				}
				this.findPage(null)
			})
		},
		//启用
		handleStart:function(params){
			var dataForm = Object.assign({}, params.row)
			console.log(dataForm);
			var status = 1;
			let req = {"userId":dataForm.id,"type":status}
			this.$api.user.updateStatus(req).then((res) => {
				if(res.code == 200) {
					this.$message({ message: '操作成功', type: 'success' })
				} else {
					this.$message({message: '操作失败, ' + res.msg, type: 'error'})
				}
				this.findPage(null)
			})
		},
		// 时间格式化
      	dateFormat: function (row, column, cellValue, index){
          	return format(row[column.property])
      	},
		//状态格式化
		stateFormat(row, column) {
			console.log(row.state)
			if (row.state === 1) {
			return '正常'
			} else if (row.state === 2) {
			return '停用'
			} 
      	},	
		// 处理表格列过滤显示
      	displayFilterColumnsDialog: function () {
			this.$refs.tableColumnFilterDialog.setDialogVisible(true)
      	},
		// 处理表格列过滤显示
      	handleFilterColumns: function (data) {
			this.filterColumns = data.filterColumns
			this.$refs.tableColumnFilterDialog.setDialogVisible(false)
      	},
		// 处理表格列过滤显示
      	initColumns: function () {
			this.columns = [
				//{prop:"id", label:"序号", minWidth:50},
				{prop:"id", label:"护士编号", minWidth:120},
				{prop:"name", label:"护士姓名", minWidth:120},
                {prop:"hospitalName", label:"所在医院", minWidth:120},
                {prop:"phone", label:"联系方式", minWidth:120},
				{prop:"status", label:"状态", minWidth:70, formatter:this.stateFormat},
				// {prop:"createBy", label:"创建人", minWidth:120},
				// {prop:"createTime", label:"创建时间", minWidth:120, formatter:this.dateFormat}
				// {prop:"lastUpdateBy", label:"更新人", minWidth:100},
				// {prop:"lastUpdateTime", label:"更新时间", minWidth:120, formatter:this.dateFormat}
			]
			this.filterColumns = JSON.parse(JSON.stringify(this.columns));
      	},
		setType(){
			this.GLOBAL.setType('3');
		}
	},
	created(){
		this.setType();
	},
    mounted() {
        this.initColumns()
		this.findHospital()
		this.findPage()
		
	}
}
</script>